<template>
  <div></div>
</template>

<script setup>
import CallImg from '@/assets/img/call.png'
// 该功能仅在localhost和https下可用
const notify = ref(null)
const timer = ref(null)
const openNotice = async () => {
  const data = await Notification.requestPermission()
  if (data === 'granted') {
    closeNotice()
    if (timer.value) {
      clearTimeout(timer.value)
      timer.value = null
    }
    notify.value = new Notification('通知', {
      body: '有来电请注意接听',
      requireInteraction: true,
      icon: CallImg,
      silent: true
    })
    timer.value = setTimeout(() => {
      closeNotice()
    }, 10e3)
  } else {
    // denied
    await Notification.requestPermission()
  }
}
const closeNotice = () => {
  if (notify.value) {
    notify.value.close()
  }
}
defineExpose({ openNotice, closeNotice })
</script>

<style lang="scss" scoped></style>
